<template>
    <div>
        <el-row class="bg_write">
            <el-row>
                <el-col :span="24" class="content_title">
                    <el-col :span="12">
                        <HeadTitle></HeadTitle>
                    </el-col>
                    <el-col :span="12">
                        <el-button  :loading='$store.state.isLoading' @click="$router.go(-1)" type="primary" class="f_r" size="mini">返回</el-button>
                    </el-col>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="24">
                    <div class="user_info"  v-loading ="loading">
                        <h3 style="margin-bottom:10px;">第{{detail_id}}行记录</h3>
                        <div class="info" >
                            <ul>
                                <li v-for="(item,i) in header_data" :key="i" >
                                    <span>{{item.title}}：</span>{{list_detail[item.iden]}}

                                </li>
                            </ul>
                        </div>
                        <div class="clearbox" style="clear: both"></div>
                    </div>
                </el-col>
            </el-row>
        </el-row>

    </div>
</template>

<script>
    import HeadTitle from "@/components/currency/HeadTitle.vue";
    export default {
        name: "excel_detail",
        components:{
            HeadTitle
        },
        data(){
            return {
                detail_id:1,
                loading:false,
                list_detail:{

                },
                header_data:[
                    {iden:"",title:""}
                ],
            }
        },
        created(){
            this.get_excel_detail();
        },
        methods:{
            get_excel_detail(){
                this.loading = true ;
                this.detail_id = this.$route.query.id;
                this.$api.getauto.get_excel_detail({id:this.detail_id}).then(res=>{
                    if (res.data.code == 200){
                        this.loading = false ;
                        this.list_detail = res.data.result.data || {};
                        this.header_data = res.data.result.con_ar;
                    }else{
                        this.loading = false ;
                    }
                })
            },
        },
        watch:{
        }
    }
</script>

<style scoped>
    .info{

        margin-left:20px;
    }

    .info li{
     display: inline-block;
        width: 30%;
        margin:10px 5px 5px 0;
    }

</style>